<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="renderer" content="webkit">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <link rel="icon" href="/favicon.ico">
  <title id="title1">KJ971(A)煤矿瓦斯抽采(放)监控系统</title>
  <!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]-->
  <style>
    html,
    body,
    #app {
      height: 100%;
      margin: 0px;
      padding: 0px;
    }

    .chromeframe {
      margin: 0.2em 0;
      background: #ccc;
      color: #000;
      padding: 0.2em 0;
    }

    #loader-wrapper {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 9;
      background: linear-gradient(180deg, rgba(234, 244, 254, 1) 0%, rgba(255, 255, 255, 1) 100%);
    }

    .wrapperBox {
      background-image: url('/loadingBg.png');
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 10;
    }

    .logo_title {
      display: flex;
      align-items: center;
      position: absolute;
      top: 20px;
      left: 20px;
    }

    .logo_title p {
      padding: 0;
      margin: 0;
      font-size: 24px;
    }

    .logo_title img {
      width: 30px;
      height: 30px;
    }

    .logo_title .desc {
      font-family: "思源黑体 Medium";
      color: rgba(34, 68, 119, 1);
      font-size: 24px;
      margin-left: 10px;
      font-weight: 700;

    }

    #loader {
      display: block;
      position: relative;
      left: 50%;
      top: 40%;
      width: 130px;
      height: 240px;
    }

    #loader img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;

    }

    #loader .load_title {
      position: absolute;
      left: 50%;
      bottom: -60px;
      transform: translateX(-50%);
      white-space: nowrap;
    }
  </style>
</head>

<body>
  <div id="app">
    <div id="loader-wrapper">
      <div class="wrapperBox">
        <div class="logo_title">
          <img src="/logo2.png" alt="" />
          <div class="desc">
            <p id="p1">KJ971(A)煤矿瓦斯抽采(放)监控系统</p>
            <p id="p2" style="font-size: 11px;font-weight: 500;">KJ971(A)Mineral Gas Extraction(Release) Monitoring System</p>
          </div>
        </div>
        <div id="loader">
          <img src="/loadingjiqi.png" alt="">
          <img class="gifBox" src="/loadinggif.gif" alt="">
          <div class="load_title">正在加载系统资源 请耐心等待~</div>
        </div>
        <div style="position: absolute;bottom: 20px;color: rgba(34, 68, 119, .6);display: flex;justify-content: space-between;
        align-items: end;width: 98%;padding: 0 20px;">
          <span id="span1"> </span>
          <span style="text-align: right;">
            <span>服务电话：0519-85129371</span><br />
            <span>
              江苏三恒科技股份有限公司-技术支持
            </span>
          </span>
        </div>
      </div>
    </div>
  </div>
  <script>
    function ajaxTestGet() {
      // 创建一个GET请求的示例
      const xhr = new XMLHttpRequest();
      xhr.open('GET', '/stage-api/loginInfo/systemName', true); // 初始化请求
      xhr.onreadystatechange = function () {
        if (xhr.readyState === 4 && xhr.status === 200) {
          if(xhr.responseText){
            let data=JSON.parse(xhr.responseText)
            var title1 = document.getElementById('title1');
             title1.textContent=data.data.chinese
            var p1=document.getElementById('p1')
            p1.textContent=data.data.chinese
            var p2=document.getElementById('p2')
            p2.textContent=data.data.english
            var span1=document.getElementById('span1')
            span1.textContent=data.data.copyright
          }
        }
      };
      xhr.send(); // 发送请求
    }
    ajaxTestGet()
  </script>
  <script type="module" src="/src/main.js"></script>
</body>

</html>